/*
 * Container 布局
 * 用来创建一个可见的矩形元素
 * 可以设置margin、padding、border等
 * 有子控件是包裹子控件
 * 否则填充父控件
 * 如果有子控件也想填充父控件
 * constraints: BoxConstraints.expand()
 * 但是约束会传递给子控件
 * 所以最好用：
 * alignment: Alignment.center
 * 
 * 还有一个带动画的Container：
 * AnimatedContainer
 * 增加一个时间参数
 * 当属性改变的时候会有动画效果
 * 
 */

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: "Container",
      theme: ThemeData.light(),
      home: Scaffold(
        appBar: AppBar(
          leading: AnimatedContainer(
            duration: Duration(seconds: 1),
            color: Colors.blue[200],
          ),
          title: Text('Container', textDirection: TextDirection.ltr),
        ),
        body: Container(
          // width: 200,
          // height: 200,
          // 居中对齐,不需要使用center
          alignment: Alignment.center,
          child: Text('hello world', textDirection: TextDirection.ltr, textAlign: TextAlign.center),
          // margin: EdgeInsetsDirectional.only(start: 50, top: 50),
          // padding: EdgeInsets.all(10.0),
          // 旋转
          // transform: Matrix4.rotationZ(0.2),
          // 盒子装饰器，还有其他装饰器，可看 Decoration 类的实现类
          decoration: BoxDecoration(
            color: Colors.amberAccent.withOpacity(0.2),
            // 设置边线
            border: Border.all(color: Colors.deepOrangeAccent),
            // 圆角
            // borderRadius: BorderRadius.all(Radius.circular(8.0)),
            // 设置阴影
            // boxShadow: [BoxShadow(offset: Offset(3, 3), color: Colors.black12)],
            // 设置形状
            // shape: BoxShape.circle
          ),
        ),
      ),
    );
  }

}